<template>
  <a-drawer v-model:visible="visible" title="美团账号详情" :width="width >= 600 ? 600 : '100%'" :footer="false">
    <a-descriptions :column="2" size="large" class="general-description">
      <a-descriptions-item label="">{{ dataDetail?.id }}</a-descriptions-item>
      <a-descriptions-item label="品牌">{{ dataDetail?.brand }}</a-descriptions-item>
      <a-descriptions-item label="地区">{{ dataDetail?.area }}</a-descriptions-item>
      <a-descriptions-item label="账号">{{ dataDetail?.account }}</a-descriptions-item>
      <a-descriptions-item label="密码">{{ dataDetail?.password }}</a-descriptions-item>
      <a-descriptions-item label="所属部门">{{ dataDetail?.deptName }}</a-descriptions-item>
      <a-descriptions-item label="所属人员">{{ dataDetail?.nickname }}</a-descriptions-item>
      <a-descriptions-item label="门店同步时间">{{ dataDetail?.orderShopTime }}</a-descriptions-item>
      <a-descriptions-item label="项目同步时间">{{ dataDetail?.orderProjectTime }}</a-descriptions-item>
      <a-descriptions-item label="订单同步时间">{{ dataDetail?.orderDetailTime }}</a-descriptions-item>
      <a-descriptions-item label="评价同步时间">{{ dataDetail?.feedbackInfoTime }}</a-descriptions-item>
      <a-descriptions-item label="指标同步时间">{{ dataDetail?.storeMetricsTime }}</a-descriptions-item>
      <a-descriptions-item label="状态">
        <a-tag v-if="dataDetail?.enable" color="green">启用</a-tag>
        <a-tag v-else color="red">禁用</a-tag>
      </a-descriptions-item>
      <a-descriptions-item label="创建时间">{{ dataDetail?.createTime }}</a-descriptions-item>
    </a-descriptions>
  </a-drawer>
</template>

<script setup lang="ts">
import { useWindowSize } from '@vueuse/core'
import { type BrandAccountDetailResp, getBrandAccount as getDetail } from '@/apis/cakerun/brandAccount'

const { width } = useWindowSize()

const dataId = ref('')
const dataDetail = ref<BrandAccountDetailResp>()
const visible = ref(false)

// 查询详情
const getDataDetail = async () => {
  const { data } = await getDetail(dataId.value)
  dataDetail.value = data
}

// 打开
const onOpen = async (id: string) => {
  dataId.value = id
  await getDataDetail()
  visible.value = true
}

defineExpose({ onOpen })
</script>

<style scoped lang="scss"></style>
